<%--
  资源管理
  Created by IntelliJ IDEA.
  User: admin
  Date: 2016/7/2
  Time: 15:27
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!--公共声明的引用 begin-->
<%@include file="/page/base/declare.jsp"%>
<!--公共声明的引用 end-->
<!DOCTYPE html>
<html lang="en">
<head>
    <%@include file="../base/head.jsp"%>
    <!--public css import begin-->
    <link href="/static/css/base/common.base.css" rel="stylesheet">
    <!--public css import end-->
    <!--public js import begin-->
    <script src="/static/js/base/common.base.js"></script>
    <!--public js import end-->
    <style>
        select{
            width: 178px;
        }
    </style>
</head>
<body>

<!--导航栏引入 begin-->
<%@include file="../base/navigation.jsp"%>
<!--导航栏引入 end-->

<div class="ch-container">
    <div class="row">
        <!--left menu begin-->
        <%@include file="../base/left.jsp"%>
        <!--left menu end-->

        <div id="content" class="col-lg-10 col-sm-10">

           <%@include file="../base/breadcrumb.jsp"%>

            <!-- content starts -->
            <div class="box col-md-12">
                <div class="row">
                    <div class="box col-md-12">
                        <div class="box-inner">
                            <div class="box-header well" data-original-title="">
                                <h2><i class="glyphicon glyphicon-user"></i> Responsive, Swipable Table</h2>

                                <div class="box-icon">
                                    <a href="#" class="btn btn-minimize btn-round btn-default"><i
                                            class="glyphicon glyphicon-chevron-up"></i></a>
                                    <a href="#" class="btn btn-close btn-round btn-default"><i
                                            class="glyphicon glyphicon-remove"></i></a>
                                </div>
                            </div>
                            <div class="box-content">
                                <a id="addSource" class="btn btn-info" href="#"  data-toggle="modal" data-target="#addResource">
                                    <i class="glyphicon glyphicon-plus icon-white"></i>
                                    添加资源
                                </a>
                            </div>
                            <div class="box-content">
                                <table class="table table-striped table-bordered responsive">
                                    <thead>
                                    <tr>
                                        <th>资源号</th>
                                        <th>资源等级</th>
                                        <th>资源类型</th>
                                        <th>父级资源</th>
                                        <th>资源名称</th>
                                        <th>请求路径</th>
                                        <th>操作人</th>
                                        <th>创建时间</th>
                                        <th>操作</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                        <c:forEach items="${resources}" var="item">
                                            <tr>
                                                <td>${item.id}</td>
                                                <td>${item.level}</td>
                                                <td>
                                                    <c:if test="${item.type == 1}">页面</c:if>
                                                    <c:if test="${item.type == 2}">按钮</c:if>
                                                    <c:if test="${item.type == 3}">通用接口</c:if>
                                                </td>
                                                <td>
                                                    <%--<c:if test="${item.level == 2}">${item.parentName}</c:if>--%>
                                                            ${item.parentId}
                                                </td>
                                                <td class="center">${item.name}</td>
                                                <td class="center">${item.url}</td>
                                                <td class="center">${item.adminName}</td>
                                                <td class="center"><fmt:formatDate value="${item.createTime}" pattern="yyyy/MM/dd HH:mm:ss"></fmt:formatDate></td>
                                                <td class="center">
                                                    <a class="btn btn-success" href="#">
                                                        <i class="glyphicon glyphicon-zoom-in icon-white"></i>
                                                        View
                                                    </a>
                                                    <a class="btn btn-info" href="#">
                                                        <i class="glyphicon glyphicon-edit icon-white"></i>
                                                        Edit
                                                    </a>
                                                    <a class="btn btn-danger" href="#" onclick="deleteResource(${item.id})">
                                                        <i class="glyphicon glyphicon-trash icon-white"></i>
                                                        删除
                                                    </a>
                                                </td>
                                            </tr>
                                        </c:forEach>
                                    </tbody>
                                </table>
                                <div class="center">
                                    <ul class="pagination pagination-centered">
                                        <li><a href="#">Prev</a></li>
                                        <li class="active">
                                            <a href="#">1</a>
                                        </li>
                                        <li><a href="#">2</a></li>
                                        <li><a href="#">3</a></li>
                                        <li><a href="#">4</a></li>
                                        <li><a href="#">Next</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--/span-->

                </div>
            </div>

            <div class="modal fade" id="addResource" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
                 aria-hidden="true">

                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h3>添加资源<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button></h3>
                        </div>
                        <form id="addResourceForm" action="">
                            <div class="modal-body">
                                <div class="form-group">
                                    <label class="form_label">资源名称：</label>
                                    <input type="text" class="form-field" name="name">
                                </div>
                                <div class="form-group">
                                    <label class="form_label">资源类型：</label>
                                    <select id="type" class="form-field" name="type">
                                        <option value="1">页面</option>
                                        <option value="2">按钮</option>
                                        <option value="3">通用接口</option>
                                    </select>
                                    <%--<input type="text" class="form-field" name="name">--%>
                                </div>
                                <div class="form-group">
                                    <label class="form_label">资源等级：</label>
                                    <select id="level" class="form-field" name="level">
                                        <option value="1">一级资源</option>
                                        <option value="2">二级资源</option>
                                    </select>
                                    <%--<input type="text" class="form-field" name="name">--%>
                                </div>
                                <div class="form-group">
                                    <label class="form_label">父级资源：</label>
                                    <input type="number" class="form-field" name="parentId">
                                </div>
                                <div id="url" class="form-group" style="display: none">
                                    <label class="form_label">请求路径：</label>
                                    <input type="text" class="form-field" name="url">
                                </div>
                            </div>
                            <div class="modal-footer">
                                <a href="#" class="btn btn-default" onclick="closeModal()">关闭</a>
                                <a href="#" class="btn btn-primary" onclick="submitAddResource()">保存</a>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
            <!-- content ends -->
        </div>
    </div><!--/fluid-row-->

</div>
<!--页脚引用 begin-->
<%@include file="/page/base/footer.jsp"%>
<!--页脚引用 end-->
</body>
<script>
    //显示添加的模态框
    $("#addSource").bind("click", function () {
        $("#addModal").addClass("in");
        $("#addModal").show();
    });

    //关闭模态框
    function closeModal() {
        $("#addModal").removeClass("in");
        $("#addModal").hide();
    }

    //提交添加资源的表单
    function submitAddResource() {
         $.ajax({
             url:'resource/add_resource.json',
             type:'post',
             data: $("#addResourceForm").serialize(),
             dataType:"json",
             async : false, //默认为true 异步
             error:function(){
                 alert('error');
             },
             success:function(data){
                 alert("添加成功！");
                 window.location.reload();
             }
     });
    }

    //删除
    function deleteResource(resourceId) {
        if(window.confirm("是否确定删除？")) {
            $.ajax({
                url:'resource/delete_resource.json?resourceId=' + resourceId,
                type:'get',
                dataType:"json",
                async : false, //默认为true 异步
                error:function(){
                    alert('error');
                },
                success:function(data){
                    alert("删除成功！");
                    window.location.reload();
                }
            });
        }
    }

    //切换资源等级
    $("#level").bind("change", function() {
        console.log($("#level").val());
        if($("#level").val() == 2) {
            $("#url").show();
        }else {
            $("#url").hide();
        }
    });
</script>
</html>
